<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>展开运算符基本使用</title>
  <!-- 
  
  -->
</head>
<body>

  <script>
    // 1.展开语法可以将数组展开为逗号分隔的参数序列
    const arr = [1, 2, 3, 4, 5]
    console.log(...arr) // 1 2 3 4 5

    // 2.展开语法可以将数组展开为逗号分隔的参数序列
    function sum(a, b, c, d, e) {
      return a + b + c + d + e
    }
    console.log(sum(...arr)) // 15

    // 3.展开语法可以将对象展开为逗号分隔的参数序列
    const obj = {name: 'why', age: 18}
    console.log({...obj}) // {name: 'why', age: 18}

    // 4.展开语法可以将对象展开为逗号分隔的参数序列
    const obj2 = {...obj, height: 1.88}
    console.log(obj2) // {name: 'why', age: 18, height: 1.88}

    // 5.展开语法可以将字符串展开为逗号分隔的参数序列
    const str = 'hello'
    console.log(...str) // h e l l o

    // 6. 不可以这样来使用
    // foo(...obj) // 在函数的调用时, 用展开运算符, 将对应的展开数据, 进行迭代
    // 可迭代对象: 数组/string/arguments
    // function foo(...args) {
    //   console.log(args)
    // }
    // foo(...obj) // Uncaught TypeError: Spread syntax requires ...iterable[Symbol.iterator] to be a function
  </script>
  
</body>
</html>